<template>
 <div>
<Top/>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../css/jpetstore.css" type="text/css">
</head>
<body>



<div id="Content">

    <div id="Catalog">

        <h2>Cart</h2>

        <table>
            <tr>
                <th><b>Item ID</b></th>
                <th><b>Product ID</b></th>
                <th><b>Description</b></th>
                <th><b>In Stock?</b></th>
                <th><b>Quantity</b></th>
                <th><b>List Price</b></th>
                <th><b>Total Cost</b></th>
                <th>&nbsp;</th>
            </tr>

            <!-- <tr th:if="${session.cart.getNumberOfItems()}le '0'">
                <td colspan="8"><b>Your cart is empty.</b></td>
            </tr> -->

            <tr v-for="item in cartvo">
                <td >{{item.itemId}}</td>
                <td th:text="${cartItem.getItem().getProduct().getProductId()}">{{item.productId}}</td>
                <td th:text="${cartItem.getItem().getAttribute1()}+' '+${cartItem.getItem().getProduct().getName()}">{{item.attribute1}}</td>
                <td th:text="${cartItem.isInStock()}">true</td>
                <td th:text="${cartItem.getQuantity()}">1</td>
                <td th:text="${cartItem.getItem().getListPrice()}">{{item.listPrice}}</td>
                <td>
                    <a  th:text="remove" @click="remove">remove</a><!---->
                </td>
            </tr>

            <tr>
<!--                <td th:text="'total:$'+${session.cart.getSubTotal()}"></td>-->
                <td>
                    <a th:text="UpdateCart" th:href="@{'/cart/clearAll'}" class="Button" @click="allSelect()">全选</a>
                </td>
                <td>
                    
                </td>
            </tr>
        </table>
        <h3><a href="/cart/checkOut" class="Button">Proceed to Checkout</a></h3>
    </div>
</div>


</body>
<Bottom/>
 </div>
</template>
<script>
import Top from '../../common/top'
import Bottom from '../../common/bottom'

  export default {
       components: {
         Bottom,
        Top
       
    },
    created () {
        console.log("cart")
        console.log(this.username)
        const _this = this
        //这句话将route中的参数传递到category中
        //  const url = this.$route.params.CategoryId
        //  console.log(url)
        console.log("http://localhost:8081/account/userCartVOList/"+this.username)
        console.log("mask")
        axios.get("http://localhost:8081/account/userCartVOList/"+this.username).then(function(resp){
              console.log(resp)
              _this.cartvo = resp.data.data
          })  
          console.log(this.cartvo)
    },
    data(){
        return{
            username : localStorage.getItem("token"),
            cartvo : [],
            sum : 0
        }
    },
    // methods:{
    //     remove : {
            
    //     },
    //     allSelect():{
    //         const 
    //     }
    // }
    methods: {
      allSelect() {
          const _this = this;
          if(_this.sum > 0){

          }else{
          for(var i = 0;i < _this.cartvo.length;i++){
              _this.sum += _this.cartvo[i].listPrice;

          }
          }
          console.log(_this.sum)
       alert(_this.sum)
            
          }
    },
    
  }
  
    
</script>

<style scoped>

</style>